
/**
 * 声明命名空间
 */
Ext.ns('Learn.panel');
//Ext.namespace('Learn.panel');//ns是namespace的简写

/**
 * 定义Learn.panel.PanelExtend 组件，继承Ext.Panel父类
 */
Learn.panel.PanelExtend = Ext.extend(Ext.Panel, {
	
	id : null,//自定义配置选项id
	
	itemsSize : null,//自定义配置选项imtesSize
	
	initComponent : function(){//覆盖父类的组件初始化方法
	
		//底部工具条
		var bbar = new Ext.Toolbar([{
				xtype : 'label',
				text : '文本'
			}, {
				xtype : 'textfield',
				width : 100,
				value : '编辑框'
			}, {
				xtype : 'checkbox',
				boxLabel : '选择框'
			}, {
				xtype : 'button',
				text : '第一个',
				handler : function(btn){
					alert(btn.text);
				}
			}, {
				id : 'preBtn',
				text : '上一个',
				handler : function(btn){
					alert(btn.id);
				}
			}, {
				id : 'nextBtn',
				text : '下一个',
				handler : function(){
					alert(Ext.getCmp('nextBtn').text);
				}
			}, {
				text : '最后一个'
			}]);
		
		
			/**
			 * 覆盖父类的配置项
			 */
			Ext.apply(this, {
				title : '我的第一个面板',
				width : 900,//面板宽度
				height : 750,//面板高度
				frame : false,
				border : false,
				
				layout : 'border',//指定布局管理器
				
				tbar : [{//顶部工具条
					text : '增加'
					
				}, {
					text : '删除'
				}, {
					text : '修改'
				}, {
					text : '查询'
				}],
				
				items : [//配置面板的items
				new Ext.Panel({
					region : 'north',
					title : '北部面板',
					width : 900,
					height : 200,
					frame : true,
					border : true
				}), {
					region : 'south',
					title : '南部面板',
					width : 900,
					height : 200,
					frame : true,
					border : true
				}, {
					region : 'west',
					title : '西部面板',
					width : 300,
					height : 200,
					frame : true,
					border : true
				}, {
					region : 'east',
					title : '东部面板',
					width : 300,
					height : 200,
					frame : true,
					border : true
				}, {
					region : 'center',
					title : '中部面板',
					width : 300,
					height : 200,
					frame : true,
					border : true
				}],
				
				bbar : bbar,//底部工具条
				
				buttonAlign : 'center',//指定按钮排列方式，还可以是 left,right
				buttons : [new Ext.Button({//配置按钮组
					text : '确定',
					handler : function(btn){
					
					}
				}), {
					text : '关闭'
				}]
			});
			
			Learn.panel.PanelExtend.superclass.initComponent.call(this);//调用父类的构造方法
		
	}

});
